<template>
    <t-layout-page>
        <t-layout-page-item>
            <div v-for="(item, index) in radioList" :key="index" class="radio-title">
                <div>{{ item.title }}</div>
                <div v-for="(item1, index1) in item.radio" :key="index1">
                    <el-radio-group v-model="item.il">
                        <el-radio :value="item1.ol" size="large">{{ item1.title }}</el-radio>
                    </el-radio-group>
                </div>
            </div>
        </t-layout-page-item>
    </t-layout-page>
</template>

<script setup lang="tsx">
const radio1 = ref('')
const radioList = ref([
    {
        title: '短信进入查看报告验证身份方式',
        il:'',
        radio: [
            { ol: '1', title: '身份证件后六位' },
            { ol: '2', title: '姓名+诊疗卡号' },
            { ol: '3', title: '姓名+身份证号' },
            { ol: '4', title: '手机号+验证码' }
        ]
    },
    {
        title: '扫码查看报告验证身份',
        il:'',
        radio: [
            { ol: '1', title: '身份证件后六位' },
            { ol: '2', title: '姓名+诊疗卡号' },
            { ol: '3', title: '姓名+身份证号' },
            { ol: '4', title: '手机号+验证码' }
        ]
    },
    {
        title: ' 是否启用双因子登录',
        il:'',
        radio: [
            { ol: '1', title: '数字图片验证码' },
            { ol: '2', title: '滑动图片验证码' }
        ]
    },
    {
        title: '',
        il:'',
        radio: [
            { ol: '1', title: '是否允许验证用户直接查看检查记录' },
        ]
    }
])
</script>

<style lang="scss" scoped>
.radio-title{
    margin: 10px 0 24px;
}
</style>